<template>
  <tr v-for="(item, index) in data">
    <td v-for="(column,colIndex) in columns">
      {{ item[column.field] }}
    </td>
    <Tr :columns="columns" :data="item.children" v-if="item?.children?.length">
    </Tr>
  </tr>
</template>

<script setup lang="ts">

import {ref, toRaw} from "vue";

const props = withDefaults(defineProps<{
  data?: [],
  fixedCheckbox?: boolean,
  showCheckBox?: boolean,
  fixedLineNumber?: boolean,
  showLineNumber?: boolean,
  columns: []
}>(), {
  data: [],
  showLineNumber: true,
  fixedLineNumber: true,
  fixedCheckbox: true,
  showCheckBox: false,
  onRowCheckedChange: (selected: boolean, rowData: object, rowIndex: number) => {
  },
  onRowClick: (rowData: object, rowIndex: number) => {
  },
  onRowDblClick: (rowData: object, rowIndex: number) => {
  },
});

const tesetT = ref(null);
const {onRowCheckedChange} = props;
let timer;
const handleTrClick = (rowIndex: number) => {
  if (timer != undefined) {
    onRowDblClick(toRaw(refData.value[rowIndex]), rowIndex);
    clearTimeout(timer);
    timer = undefined;
    return;
  }
  timer = setTimeout(function () {
    onRowClick(toRaw(refData.value[rowIndex]), rowIndex);
    clearTimeout(timer);
    timer = undefined;
  }, 400);
}

//处理行checkbox change事件
const handleRowCheckboxChange = (rowIndex: number, event: events) => {
  event.stopPropagation();
  event.preventDefault();

  const checked = event.target.checked;
  refData.value[rowIndex].checked = checked;
  onRowCheckedChange(checked, toRaw(refData.value[rowIndex]), rowIndex);
  if (!checked) {
    allCheckboxChange.value = false;
    return;
  }
  let flag = true;
  refData.value.forEach((item: any, index: number) => {
    if (!item.checked) {
      flag = false;
    }
  });
  allCheckboxChange.value = flag;
}

const handleCellVal = (rowData, head, colIndex, rowIndex) => {
  rowData = toRaw(rowData);
  if (head.colFormatVal != undefined && head.colFormatVal != null) {
    return head.colFormatVal(rowData, dicData[head.dicType], colIndex, rowIndex);
  }
  if (head.dicType != null && head.dicType != undefined) {
    const dicItemData = dicData[head.dicType];
    for (const item of dicItemData) {
      if (item.val == rowData[head.field]) {
        return item.text;
      }
    }
  }
  return rowData[head.field];
}

</script>

<style scoped>

</style>